<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    // // es5中定义类  类名首字母大写
    // function Person(name, age) { 
    //   this.name = name //传进来的参数赋值给当前对象    this指向新创建出来的对象new Person("plum", 16);也即是p
    //   this.age = age
    //   // 给类定义函数 方式一  存在弊端
    //   this.running = function(){
    //     return name + ' is running'
    //   }
    // }

    // // 给类定义函数  方式二   将函数放到原型上  (常使用)
    // Person.prototype.running2 = function() {
    //   console.log(this.name, "running2");  //this 指向创建出来的对象new Person("plum", 16);也即是p
    // }
    
    // // new关键字调用，生成一个新的对象，对象的类型为Person类型
    // var p = new Person("plum", 16);

    // console.log(p.name,p.age,p.running())
    // p.running2() //隐式绑定  p调用的  p里面有name


    // es6通过class创建类
    class Person {
      // 构造方法   使用new关键字创建实例对象时会执行
      constructor(name, age){
        this.name = name //this 指向新创建的对象p
        this.age = age
      }

      // 定义方法
      running() {
        console.log(this.name,'running');
      }
    }

    // 创建对象
    var p = new Person("plum", 16);
    console.log(p.name,p.age)
    p.running()


    // this绑定题目
    let func = p.running
    // func() // Cannot read properties of undefined (reading 'name')  未绑定this

    var obj = {
      name: 'jxweber',
      age: 16
    }

    // func.call(obj) //jxweber running

    // 重新赋值
    func = func.bind(obj)
    func(); //jxweber running

  </script>
</body>
</html>